<template>
	<div id="member-bus-list">
		<div class="content">
			<top-nav :title="data.title">
				<template v-slot:right class="vist-sti">
					<span class="vist-sti-icon iconfont icon-liulan"></span>
					<span class="vist-sti-count">{{data.pageBasicData.viewPageCount}}</span>
				</template>
			</top-nav>
			<selection 
			:optList="data.optList"
			:optListAct="data.optListAct" 
			:eventName="data.eventName"
			@chooseOpt="chooseOpt"/>
			<filter-top 
			@showOverlay="showOverlay" 
			@hideOverlay="hideOverlayShow" 
			@filterMemberList="filterMemberList"
			:filterText="data.filterText"
			:overlayShow="data.overlayShow"
			/>
			<list 
			id="member-list-mescroll" 
			ref="list"
			:optList="data.optList"
			:optListAct="data.optListAct"
			:listData="data.list" 
			:height="data.height" 
			:pageBasicData="data.pageBasicData"
			@setPageBasicData="setPageBasicData"
			@setListData="setListData"
			class="mescroll"
			></list>
			<btn-menu 
			:pageBasicData="data.pageBasicData"
			@setShare="setShare"
			/>
			<!-- 显示分享 -->
			<user-shared-show ref="userSharedShow" />
			<van-overlay :show="data.overlayShow" @click="hideOverlayShow" />
		</div>
	</div>
</template>

<script>
// 自定义组件
import TopNav from "_components/project/common/TopNav"
import List from "_components/project/MemberBusList/List"
import FilterTop from "_components/project/MemberBusList/FilterTop"
import BtnMenu from "_components/project/MemberBusList/BtnMenu"
import Selection from "_components/project/MemberBusList/Selection"
import UserSharedShow from "_components/project/ShowWindow/UserSharedShow"

// 自定义方法
import { getQueryStrParams } from "_commonFn/url"
import { failTextVantToa } from "_projectFn/prompt"
import { isLoginChose } from '_projectFn/login'
import { checkDataEqualVal } from "_commonFn/check"
import { customShare } from '_commonFn/share'
import { getCookie } from '_commonFn/cookie.js'
import { getProImg } from "_projectFn/images"
import { setUserShareLoginUrlInfo } from "_projectFn/user"
import { checkCacheaIsPageData } from "_projectFn/check"
import { getText } from "_commonFn/string"
import { returnTime } from "_commonFn/time"

// UI组件
import { Overlay } from "vant"

// 字体
import '_assets/fonts/iconfont.css'

import Vue from "vue"
Vue.use(Overlay)

export default {
	name: 'MemberBusList',
	data() {
		return {
			data: {
				title: '工业品业务人员',
				optList: {
					member: {
						name: '人员',
						list: [],
						id: 'member',
						areaCode: '',
					},
					demand: {
						name: '需求',
						list: [],
						id: 'demand',
						areaCode: '',
					},
					help: {
						name: '互助',
						list: [],
						id: 'help',
						areaCode: '',
					},
				},
				optListAct: 'member',
				pageBasicData: {
					isSetBus: null,
					isBingWechat: 0,
					lockView: null,
					viewGroupUserItemPage: null,
					viewGroupUserItemPage2: null,
					viewPageCount: null,
					owerAssWechat: null,
					userSeminar: null,
					validSeminar: null,
				},
				apiData: [],
				list: [],
				isDataFirstTask: 0, // 首次是否获取
				height: (window.innerHeight || document.documentElement.clientHeight) - 40 - 40 - 40 - 55,
				overlayShow: false,
				mescroll: {
					member: null,
					demand: null,
					help: null,
				},
				showWindow: '',
				filterText: '区域',
				total: 0,
				mesConfig: null,
				eventName: '',
				shareInfo: {
					userShareCount: 0
				}
			}
		}
	},
	methods: {
		// 点击选择选项
		chooseOpt(id) {
			// console.log('id', id)
			if (id) {
				this.data.optListAct = id
			}
		},
		setShare(type = 'default', callback) {
			const that = this
				// console.log('type', type)
			if (that.$store.state.wechat.isWechatBro) {
				if (type === 'user') {
					console.log('点击分享')
					if (isLoginChose()) {
						// console.log('that.data.shareInfo.userShareCount', that.data.shareInfo.userShareCount)
						if (that.data.shareInfo.userShareCount > 0) {
							that.showUserShare()
							typeof callback === 'function' && callback()
							return
						} else {
							that.share(type)
							that.showUserShare()
							typeof callback === 'function' && callback()
							return
						}
					}
				} else {
					that.share(type)
				}
			} else if (type === 'user' && that.$store.state.wechat.isWechatBro === false) {
				failTextVantToa('请在微信客户端打开')
			}
		},
		share(type = 'default') {
			// console.log('type', type)
			const that = this,
			title = this.data.title,
			imgUrl = `https://www.mrobiji.com/images/global-share.png`,
			desc = `工业品业务互助社群平台`,
			url = location.href.split('#')[0],
			link = type === 'default' ? url : `${url}?shareUser=MyBusiness_${getCookie('UserId')}`;
			console.log('执行分享')
			customShare({
				shareData: {
					shareFriend: { // 分享给朋友
						title, // 分享标题
						desc, // 分享描述
						link, // 分享地址
						imgUrl // 分享图片
					},
					shareDynamic: { // 分享动态
						title, // 分享标题
						link, // 分享地址
						imgUrl // 分享图片
					}
				},
				fn() {
					if (type === 'user') {
						that.data.shareInfo.userShareCount += 1
					}
				}
			})
		},
		// 显示用户分享提示
		showUserShare() {
			this.$refs.userSharedShow.showOverlay()
		},
		hideOverlayShow() {
			this.data.showWindow = ''
			this.data.overlayShow = false
			this.data.eventName = ''
		},
		showOverlay(eventName) {
			this.data.overlayShow = true
			if (eventName) {
				this.data.eventName = eventName
			} else {
				this.data.eventName = ''
			}
		},
		// 重新筛选人员列表
		filterMemberList({areaCode, key = '', areaName}) {
			this.data.optList[this.data.optListAct].areaCode = areaCode
			if (this.data.optList[this.data.optListAct].list.length) {
				this.data.optList[this.data.optListAct].list.splice(0, this.data.optList[this.data.optListAct].list.length)
			}
			this.data.filterText = areaName
			this.$refs.list.resetUpScroll(this.data.optListAct)

			// if (this.data.list.length) {
			// 	this.data.list.splice(0, this.data.list.length)
			// }
			// this.data.filterText = areaName
			// this.data.request.page = 1
			// this.data.request.area = areaCode
			// this.data.request.key = key
			// this.data.mescroll.resetUpScroll( true )
		},
		setPageBasicData(data) {
			console.log('setPageBasicData', data)
			this.data.pageBasicData.isSetBus = data.IsBusiness
			this.data.pageBasicData.isBingWechat = data.BindWx
			// this.data.pageBasicData.isBingWechat = 0
			this.data.pageBasicData.lockView = data.LockView
			this.data.pageBasicData.viewGroupUserItemPage = data.ViewGroupUserItemPage
			// this.data.pageBasicData.viewGroupUserItemPage2 = data.ViewGroupUserItemPage2
			this.data.pageBasicData.viewGroupUserItemPage2 = 1
			this.data.pageBasicData.viewPageCount = data.ViewPageCount || 0
			this.data.pageBasicData.owerAssWechat = data.OwerAssWechat
			this.data.pageBasicData.userSeminar = data.UserSeminar
			this.data.pageBasicData.validSeminar = data.ValidSeminar
			this.data.optList.member.name = `人员<span class="opt-sti">(${data.memberCount || 0}人)</span>`
			this.data.optList.demand.name = `需求<span class="opt-sti">(${data.DemandCount}人)</span>`
			this.data.optList.help.name = `互助<span class="opt-sti">(${data.PartnerCount}人)</span>`
		},
		// 设置用户信息左边数据
        setThumbSty({isStick, isBusiness, isRestricted, isBindWx}) {
            const data = {}
            const widthheight = isRestricted ? 47 : 40
            const thumbClassText = this.setThumbClassText(isBusiness, isRestricted, isBindWx, isStick)
            data.width = widthheight
            data.height = widthheight
            data.thumbClass = thumbClassText.class
            data.thumbText = thumbClassText.text
            data.tag = thumbClassText.tag
            return data
        },
        // 设置用户信息左边背景class和文字
        setThumbClassText(isBusiness, isRestricted, isBindWx, isStick) {
            if (isRestricted) {
                return {
                    class: 'stick-limit-head',
                    text: '受限',
                    tag: 'limit',
                }
            }
            if (isStick) {
                return {
                    class: 'stick-user-head',
                    text: '名片',
                    tag: 'stick',
                }
            }
			return {
				class: 'stick-bus-head',
				text: '名片',
				tag: 'bus',
			}
        },
		setListData({data, id}) {
			if (id && id in this.data.optList) {
				if (Array.isArray(data) && data.length > 0) {
					const that = this
					data.forEach(item => {
						this.data.optList[id].list.push({
							area: item.Area, //	string	地区
							company: item.Company, // string	企业
							yourSelf: item.YourSelf, // string	介绍
							supply: item.Supply, // string	供应
							demand: item.Demand, // string	需求
							demandText: getText(item.Demand),
							isPartner: item.IsPartner, // int	是否设置了找合作伙伴(1:是,0:否)
							isRestricted: item.IsRestricted, // nt	是否受限(1:是,0:否)
							fine: item.Fine, // int	是否置顶(1:是,0:否)
							isIssWechat: item.OwerAssWechat,
							seminar: item.UserSeminar,
							seminarWorking: item.ValidSeminar,
							updateTimeText: returnTime({timestamp: item.UpdateTime, showTimeDetail: false}),
							viewCount: item.ViewCount,
							find: item.FindWho,
							myHelp: item.MyHelp,
							user: {
								userId: item.UserItem.UserId, // string	用户编号
								nickName: item.UserItem.NickName, // string	昵称
								sex: item.UserItem.Sex == 2 ? 0: item.UserItem.Sex, // int	性别(1:男，0：女，-1：未知)
								headImg: item.UserItem.HeadImg, // string	用户头像
								userLevel: item.UserItem.UserLevel, // int	用户级别(0：普通用户,1:高级用户,2:资深用户,3:超级用户)
								signature: item.UserItem.Signature, // string	用户签名
								offer: item.UserItem.Offer, // Decimal	用户当前总贡献分
							},
							thumbSty: that.setThumbSty({
								isStick: item.Fine,
								isBusiness: item.Business,
								isRestricted: item.IsRestricted,
								isBindWx: item.BindWx,
							})
						})
					})
				}
			}
		}
	},
	mounted() {
		// console.log('mounted')
		this.data.queryStr = getQueryStrParams({
			params: ['shareUser'], 
			query: this.$route.query
		})
		if (this.data.queryStr.shareUser) {
            setUserShareLoginUrlInfo({
                urlType: 'wechatUserItem',
                userId: this.data.queryStr.shareUser
            })
        }
	},
	activated() {
		const that = this
		if (that.$store.getters.isWechatBro) {
			that.data.shareInfo.userShareCount = 0
			checkDataEqualVal({
				data: that.$store.getters,
				key: 'getWechatStatus',
				val: ['success', 'fail'],
				callback(val) {
					if (val === 'success') that.setShare()
				}
			})
		}
		// console.log('this.$route.meta', this.$route.meta)
		// console.log('activated this.$route.meta.listScrollTop', this.$route.meta.listScrollTop)
		document.getElementById(this.data.optListAct).scrollTop = this.$route.meta.listScrollTop || 0
	},
	components: {
		TopNav,
		List,
		FilterTop,
		BtnMenu,
		Selection,
		UserSharedShow,
	},
	beforeRouteLeave (to, from, next) {
		// console.log('beforeRouteLeave')
		const scrollTop = document.getElementById(this.data.optListAct).scrollTop
		// console.log('beforeRouteLeave scrollTop', scrollTop)
		from.meta.listScrollTop = scrollTop
		next()
	},
}
</script>

<style lang="scss" scoped>
// 分享提示图片
#share-hint-img {
	width: 230px;
	position: fixed;
	top: 0;
	right: 16px;
	z-index: 2;
}

.vist-sti-count {
	font-size: 12px;
	margin-left: 2px;
	padding-right: 4px;
}
</style>